<template>
    <div id="wifi" class="wifi">
        <div class="wifi-info">
            <div class="wifi-pic">
                <img class="wifi-img" :src="icon">
                <div>Lady健身女王</div>
            </div>
            <div class="wifi-comment">Lady健身女王wifi</div>
        </div>
        <button class="wifi-btn">微信连Wi-Fi</button>
        <div class="wifi-tip">{{wifiTip}}</div>
    </div>
</template>
<script>
export default {
  name: 'wifi',
  comments: 'wifi',
  data () {
    return {
      name: 'Lady健身女王',
      icon: '../../static/images/icon1.jpg',
      wifiName: 'Lady健身女王Wi-Fi',
      wifiTip: '使用手机验证方式连接',
      loading: false
    }
  },
  created () {
    document.title = 'Wi-Fi连接'
  },
  methods: {
    link: function () {
      this.loading = true
    }
  }
}
</script>

<style lang="postcss" scoped>
    .wifi-info{
        margin-top: 20%;
    }
    .wifi-img{
        width: 50px;
        height: 50px;
    }
    .wifi-success{
        font-size: 4rem;
        color: #06bf04;
    }
    .wifi-comment,.wifi-tip{
        font-size: 0.5rem;
        color: #999;
        margin-top: 5px;
    }
    .wifi-btn{
        width: 60%;
        margin-top: 40px;
    }
</style>